/**
 * Description:该类主要用于创建一个标签 
 * Copyright: 成都和为科技有限公司 2012
 * 
 * 属性：
 *   title: 容器标题
 *   distensible: true | false 是否可收缩展开。 默认false;
 *   iconclass : 图标
 *   status:panel默认是展开还是隐藏如果status为hide默认为隐藏
 * 事件：
 *   onexpand : 展开回调事件
 *   oncollapse : 收缩回调事件
 */
function Panel() {
}

Panel.inherit(Container);

/**
 * 初始化方法
 */
Panel.prototype.init = function() {
	Panel.base.init.call(this);
}

Panel.prototype.create = function() {
    var template = "<div class='panel panel-default'></div>";
    this._html = $(template)[0];
}

Panel.prototype.initLoad = function() {
    Panel.base.initLoad.call(this);
    //加载内容节点
    var bodyTemplate = "<div class='panel-body in' id='body'></div>";
    var bodyHTML = $(bodyTemplate)[0];
    $(this.getHTML()).children().each(function () {
        $(bodyHTML).append(this);
    });
    $(this.getHTML()).append(bodyHTML);
    if (this.getAttribute().title) {
        var sTitle="<div class='panel-heading'>" +
                       "<div class='panel-heading-left'>"+
                           "<h3 class='panel-title'   href='#body'>";
        if(this.getAttribute().iconclass){//增加图标功能
            sTitle+="<span class='" + this.getAttribute().iconclass + "'>&nbsp;</span>";
        }
        sTitle+=this.getAttribute().title + "</h3>" +
            "</div>" +
            "<div class='panel-heading-center'></div>" +
            "<div class='panel-heading-right'></div>" +
            "</div>";
        $(this.getHTML()).prepend(sTitle);
    }
    //可伸缩
    if (this.getAttribute().distensible == "true") {
    	this._statue = "expand";
        $(".panel-heading",this.getHTML()).append(
            "<span class='glyphicon glyphicon-chevron-up' title='点击隐藏/显示内容'" +
                " style='float:right;margin-top:-15px;cursor:pointer'>&nbsp;</span>"
        );
        var othis = this;
        $(".panel-heading span",this.getHTML()).bind("click", function() {
            othis.togglePanel();
        });
        //兼容以前的panel默认为展开
        if(this.getAttribute().status && this.getAttribute().status == "hide"){
        	$(".panel-body", this.getHTML()).collapse('hide');
	        $(".panel-heading span",this.getHTML())
	            .removeClass("glyphicon-chevron-up")
	            .addClass("glyphicon-chevron-down");
	        this._statue = "collapse";
	        this.triggerAttributeEvent("oncollapse");
        }
    }
    $(this.getHTML()).append(
        "<div class='top'>" +
            "<div class='top-left'></div><div class='top-center'></div><div class='top-right'></div>" +
        "</div>" +
        "<div class='bottom'>" +
            "<div class='bottom-left'></div><div class='bottom-center'></div><div class='bottom-right'></div>" +
        "</div>"
    );
}

Panel.prototype.togglePanel = function() {
    if (this._statue == "expand") {
        $(".panel-body", this.getHTML()).collapse('hide');
        $(".panel-heading span",this.getHTML())
            .removeClass("glyphicon-chevron-up")
            .addClass("glyphicon-chevron-down");
        this._statue = "collapse";
        this.triggerAttributeEvent("oncollapse");
    } else {
        $(".panel-body", this.getHTML()).collapse('show');
        $(".panel-heading span",this.getHTML())
            .removeClass("glyphicon-chevron-down")
            .addClass("glyphicon-chevron-up");
        this._statue = "expand";
        this.triggerAttributeEvent("onexpand");
    }
}

/**
 * 设置标题
 */
Panel.prototype.setTitle = function(sTitle) {
	$(".panel-title", this.getHTML()).text(sTitle);
}

/**
 * 清空内容
 */
Panel.prototype.clear = function() {
	$(".panel-body", this._html).empty();
}

/**
 * 增加内容
 * 
 * @param {Object}
 *            content 内容的html节点
 */
Panel.prototype.addContent = function(content) {
	$(".panel-body", this._html).append(content);
}

/**
 * 覆盖Container方法
 * @param {} content
 */
Panel.prototype.addHTML = function(oControl) {
	$(".panel-body", this._html).append(oControl.getHTML());
}